﻿@page
@model FytSoa.Web.Pages.FytAdmin.Sys.RoleMenuModel
@{
    ViewData["Title"] = "角色分配功能模块";
    Layout = "~/Pages/FytAdmin/_Layout.cshtml";
}
<style>
    .layui-table-view{margin-top:0px;}
    .layui-col-220{width:300px;}
    .right-col-body{left:300px;}
    .list-wall{padding-top:0px;}
    .fyt-center{text-align:center;}
    #tree{height:550px; overflow:auto;}
    .layui-layer-loading{box-shadow: 0 0px 0px rgba(0,0,0,.3) !important;}
    #open-form{display:none;}
    .layui-form-select dl{max-height:150px;}
</style>
<div class="layui-col-220 fyt-wall">
    <div id="tree" class="layui-tree-cus" style="overflow:auto;"></div>
    <div class="fyt-center"><button class="layui-btn" data-type="saveMenu" type="button">保存菜单权限</button></div>
</div>
<div class="right-col-body fyt-wall">
    <div class="list-wall">
        <table class="layui-hide" id="tablist" lay-filter="tool"></table>
    </div>
</div>
<script>
        layui.config({
            base: '/themes/js/modules/'
        }).use(['table', 'layer', 'jquery', 'tree', 'common'],
            function () {
                var table = layui.table,
                    layer = layui.layer,
                    $ = layui.jquery,
                    tree = layui.tree,
                    os = layui.common,
                    form = layui.form;
                table.render({
                    elem: '#tablist',
                    headers: os.getToken(),
                    url: '/api/menu/bycode',
                    cols: [
                        [
                            { field: 'name', title: '菜单名称', sort: true, fixed: 'left' },
                            { field: 'codeType', title: '功能值' },
                            { width: 100, title: '操作', templet: '#tool' }
                        ]
                    ],
                    page: false,
                    id: 'tables'
                });
                

                var guid = '', selText = '', layuiIndex='', selectIds='',active = {
                    initTree() {
                        os.ajax('api/menu/menubyrole/', { roleGuid: '@Model.roleGuids' }, function (res) {
                            console.log(res);
                            tree.render({
                                elem: '#tree'
                                , data: res.menu
                                , id:"treeId"
                                , showCheckbox:true
                                , onlyIconControl: true 
                                , click: function (obj) {
                                    guid=obj.data.id;
                                    active.reload();
                                }
                            });
                        });
                    },
                    reload: function () {
                        table.reload('tables',
                            {
                                where: {
                                    role:'@Model.roleGuids',
                                    menu: guid
                                }
                            });
                    },    
                    saveMenu: function () { 
                        var checkedData = tree.getChecked('treeId'); 
                        if (checkedData.length == 0) {
                            os.warning('请选择授权的功能模块~');
                            return;
                        }
                        selectIds = '';
                        var strMenu = active.serverArray(checkedData);
                        //console.log(active.serverArray(checkedData)); return;
                        //开始提交信息
                        var index = layer.load(1, {
                            shade: [0.1, '#fff'] 
                        });
                        os.ajax("api/rolemenu/add", { RoleGuid:"@Model.roleGuids", MenuGuid: strMenu,Types:1 }, function (res) { 
                            layer.close(index);
                            if (res.statusCode === 200) {
                                os.success('授权成功~');
                            } else {
                                os.error(res.message);
                            }
                        });
                    },
                    serverArray(arr)
                    {
                        for(var item = 0;item < arr.length;item++){
                            selectIds+=arr[item].id+",";
                            if(arr[item].children){
                                active.serverArray(arr[item].children)
                            }
                        }
                        return selectIds
                    }
                };        
                active.initTree();
                $('.fyt-wall .layui-btn').on('click', function () {
                    var type = $(this).data('type');
                    active[type] ? active[type].call(this) : '';
                });
                
                //监听授权操作
                form.on('switch(torole)', function (obj) {
                    var strRole = this.value;
                    //开始提交信息
                    var index = layer.load(1, {
                        shade: [0.1, '#fff']
                    });
                    var data = {
                        role: '@Model.roleGuids',
                        menu: guid,
                        btnfun: strRole,
                        status: obj.elem.checked?1:0
                    };
                    os.ajax("api/rolemenu/tubtnfun", data, function (res) {
                        layer.close(index);
                        if (res.statusCode === 200) {
                            if (obj.elem.checked) {
                                os.success('授权成功~');
                            }
                            else {
                                os.success('取消授权~');
                            }
                         } else {
                            os.error(res.message);
                            if (obj.elem.checked) {
                                obj.elem.checked = false;
                            } else {
                                obj.elem.checked = true;
                            }
                         }
                    });
                });
            });
</script>
<script type="text/html" id="tool">
    <input type="checkbox" name="status" value="{{d.guid}}" lay-skin="switch" lay-text="取消|授权" lay-filter="torole" {{ d.status ? 'checked' : '' }}>
</script>
